import React, { FC, useEffect, useState } from "react";
import { Space, Typography } from "antd";
import { FormOutlined } from "@ant-design/icons";
import style from "./Logo.module.scss";
import { Link } from "react-router-dom";
import { LOGIN_PATHNAME ,HOME_PATHNAME,MANAGE_INDEX_PATHNAME } from '../router'
import useGetUserInfo from "../hooks/useGetUserinfo";


const { Title } = Typography;

/**
 *  此组件为，首页、问卷页的导航条
 *  点击后 根据用户登陆信息跳转 ： 首页/我的问卷页
 * 
  */

const Logo: FC = () => {
  const {userName : username} = useGetUserInfo()
  const [path , setPath] = useState(HOME_PATHNAME)
  // 设置点击导航标题时的跳转地址，区别登陆和未登陆两种状态
  useEffect(() => {
    if(username){
      setPath(MANAGE_INDEX_PATHNAME)
    }
  } , [username])

  return (
    <div className={style.container}>
      <Link to={path}>
        <Space>
          <Title>
            <FormOutlined />
          </Title>
          <Title>远鸣问卷</Title>
        </Space>
      </Link>
    </div>
  );
};

export default Logo;
